import React from "react";
import HomeTop from "./components/HomeTop";
import HomeStore from "./components/HomeStore";
import Warehouse from "@/components/Warehouse";

import "./index.scss";

const list: any = [];

for (let i = 0; i < 12; i++) {
  const obj = {
    id: i + 1,
    has: i < 10 ? true : false,
    grade: 1,
    // path:,
    // path:Math.floor(Math.random() *2)==1?'/images/dinosaur/1.png':'/images/dinosaur2.png'
  };

  list.push(obj);
}

const emails = ["username@gmail.com", "user02@gmail.com"];

const Home = () => {
  // 声明一个仓库列表

  const [open, setOpen] = React.useState(false);

  const [selectedValue, setSelectedValue] = React.useState(emails[1]);

  const handleClickOpen = () => {
    setOpen(true);
  };

  const handleClose = (value: string) => {
    setOpen(false);
    setSelectedValue(value);
  };

  return (
    <>
      <div className="home-container">
        {/* 总数 */}
        <HomeTop />

        {/* 侏罗纪公园按钮 */}
        <div className="home-big-btn d-c-c">
          {/*  */}
          <button className="btn">
            <img src="/images/home_big_btn_icon.png" />
            <span className="name">侏罗纪公园</span>
          </button>
        </div>

        {/* 列表展示 */}
        <HomeStore handleClickOpen={handleClickOpen} list={list} />
      </div>
      {/* 仓库 */}
      <Warehouse
        selectedValue={selectedValue}
        open={open}
        onClose={handleClose}
      />
    </>
  );
};
export default Home;
